<template>
  <div class="box">
    <div class="f2">
      <div class="content">
        <div class="title">
          <h6></h6>
          企业认证
        </div>
        <!-- 企业信息表单 -->
        <div class="f2_content">
          <div class="title titles">企业信息</div>
          <!-- 营业执照 -->
          <div class="license license1" style="">
            <span class="aaa11"
              ><span style="color: #f25757">*</span>营业执照
            </span>
            <!-- 图片上传 -->
            <el-upload
              action="#"
              class="permit permit1 el-upload--picture-card"
              list-type="picture-card"
              :auto-upload="false"
              accept="image/png,image/jpg,image/JPG,image/PNG,image/jpeg"
              :on-change="handleChangeBusiness"
              :http-request="uploadFileBusiness"
              :file-list="yyzz"
              ref="pictureUpload1"
            >
              <template #file="{ file }">
                <div>
                  <img
                    class="el-upload-list__item-thumbnail"
                    :src="file.url"
                    alt=""
                  />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-preview"
                      @click="handlePictureCardPreview(file)"
                    >
                      <el-icon><zoom-in /></el-icon>
                    </span>
                    <span
                      v-if="!disabled"
                      class="el-upload-list__item-delete"
                      @click="handleRemove1(file)"
                    >
                      <el-icon><Delete /></el-icon>
                    </span>
                  </span>
                </div>
              </template>
            </el-upload>
            <div class="license-right1">
              <div>
                <p>说明：</p>
                <p>1.上传文件大小不超过5M；</p>
                <p>2.仅支持bmp、jpeg、png、jpg格式文件；</p>
                <p style="color: #f00">3.请加盖公章。</p>
              </div>
            </div>
          </div>
          <el-form
            :model="ruleForm"
            :rules="rules"
            ref="ruleForm"
            label-width="160px"
            class="demo-ruleForm"
          >
            <el-form-item label="企业名称" prop="entname">
              <el-input
                :disabled="disabledEntname"
                v-model="ruleForm.entname"
              ></el-input>
            </el-form-item>
            <el-form-item label="统一社会信用代码" prop="creditno">
              <el-input
                :disabled="disabledCreditno"
                v-model="ruleForm.creditno"
              ></el-input>
            </el-form-item>
          </el-form>
        </div>

        <!-- 法定代表人表单 -->
        <div class="f2_content">
          <div class="title titles">法定代表人信息</div>
          <!--身份证  -->
          <div class="license license1">
            <span class="aaa11"
              ><span style="color: #f25757">*</span>证件上传
            </span>
            <!-- 正面 -->
            <!-- 图片上传 -->
            <el-upload
              action="#"
              class="permit el-upload--picture-card permit-front"
              list-type="picture-card"
              :auto-upload="false"
              accept="image/png,image/jpg,image/JPG,image/PNG,image/jpeg"
              :on-change="handleChangeFront"
              :http-request="uploadFileFront"
              :file-list="sfzzm"
              ref="pictureUpload2"
            >
              <template #file="{ file }">
                <div>
                  <img
                    class="el-upload-list__item-thumbnail"
                    :src="file.url"
                    alt=""
                  />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-preview"
                      @click="handlePictureCardPreview(file)"
                    >
                      <el-icon><zoom-in /></el-icon>
                    </span>
                    <span
                      v-if="!disabled"
                      class="el-upload-list__item-delete"
                      @click="handleRemove2(file)"
                    >
                      <el-icon><Delete /></el-icon>
                    </span>
                  </span>
                </div>
              </template>
            </el-upload>
            <!-- 反面 -->
            <!-- 图片上传 -->
            <el-upload
              action="#"
              class="permit el-upload--picture-card permit-reverse"
              list-type="picture-card"
              :auto-upload="false"
              accept="image/png,image/jpg,image/JPG,image/PNG,image/jpeg"
              :on-change="handleChangeReverse"
              :http-request="uploadFileReverse"
              :file-list="sfzfm"
              ref="pictureUpload3"
            >
              <template #file="{ file }">
                <div>
                  <img
                    class="el-upload-list__item-thumbnail"
                    :src="file.url"
                    alt=""
                  />
                  <span class="el-upload-list__item-actions">
                    <span
                      class="el-upload-list__item-preview"
                      @click="handlePictureCardPreview(file)"
                    >
                      <el-icon><zoom-in /></el-icon>
                    </span>
                    <span
                      v-if="!disabled"
                      class="el-upload-list__item-delete"
                      @click="handleRemove3(file)"
                    >
                      <el-icon><Delete /></el-icon>
                    </span>
                  </span>
                </div>
              </template>
            </el-upload>
            <div class="license-right1">
              <div>
                <p>说明：</p>
                <p>1.上传文件大小不超过5M；</p>
                <p>2.仅支持bmp、jpeg、png、jpg格式文件；</p>
                <p style="color: #f00">3.请加盖公章。</p>
              </div>
            </div>
          </div>
          <div class="f2_form">
            <el-form
              :model="ruleForm"
              :rules="rules"
              ref="ruleForm"
              label-width="160px"
              class="demo-ruleForm"
            >
              <el-form-item label="法定代表人姓名" prop="legalname">
                <el-input
                  v-model="ruleForm.legalname"
                  @blur="appFincerName(ruleForm.legalname, 0)"
                ></el-input>
              </el-form-item>
              <el-form-item label="法定代表人手机号" prop="legalphone">
                <el-input
                  @blur="appFincerPhone(ruleForm.legalphone, 0)"
                  v-model="ruleForm.legalphone"
                ></el-input>

                <p v-show="showPhone" class="error">请输入正确的手机号</p>
              </el-form-item>
              <el-form-item
                label="手机验证码"
                prop="FRauthcode"
                v-show="ruleForm.FrRzstatus !== 'succ'"
              >
                <el-input v-model="ruleForm.FRauthcode"></el-input>
                <div class="timer">
                  <span
                    v-if="FrTime == 30"
                    @click="getFrAuthCode(FrTime, ruleForm)"
                    >获取验证码</span
                  >
                  <span v-else>{{ FrTime }}秒后重新获取</span>
                </div>
              </el-form-item>
              <el-form-item
                label="法定代表人证件号码"
                prop="legalcredentialnumber"
              >
                <el-input
                  @blur="appFincerNo(ruleForm.legalcredentialnumber, 0)"
                  v-model="ruleForm.legalcredentialnumber"
                ></el-input>
                <p v-show="show" class="error">请输入正确的身份证号</p>
              </el-form-item>
            </el-form>
          </div>
        </div>
        <!-- 经办人表单 -->
        <div class="f2_content">
          <div class="special">
            <div class="title titles">经办人信息</div>
            <div class="identical" @click="identical()">
              <img
                v-if="identicalRadio"
                src="../assets/PC/金融服务/组38.png"
                alt=""
              />
              <img v-else src="../assets/PC/金融服务/组39.png" alt="" />
              <span> 同法定代表人 </span>
            </div>
          </div>
          <!-- -->
          <template v-if="!identicalRadio">
            <!--身份证  -->
            <div class="license license1">
              <span class="aaa11"
                ><span style="color: #f25757">*</span>证件上传
              </span>
              <!-- 正面 -->
              <!-- 图片上传 -->
              <el-upload
                action="#"
                class="permit el-upload--picture-card permit-front"
                list-type="picture-card"
                :auto-upload="false"
                accept="image/png,image/jpg,image/JPG,image/PNG,image/jpeg"
                :on-change="jbrHandleChangeFront"
                :http-request="uploadFileFront"
                :file-list="jbrSfzzm"
                ref="pictureUpload4"
              >
                <template #file="{ file }">
                  <div>
                    <img
                      class="el-upload-list__item-thumbnail"
                      :src="file.url"
                      alt=""
                    />
                    <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleRemove4(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                  </div>
                </template>
              </el-upload>
              <!-- 反面 -->
              <!-- 图片上传 -->
              <el-upload
                action="#"
                class="permit el-upload--picture-card permit-reverse"
                list-type="picture-card"
                :auto-upload="false"
                accept="image/png,image/jpg,image/JPG,image/PNG,image/jpeg"
                :on-change="jbrHandleChangeReverse"
                :http-request="uploadFileReverse"
                :file-list="jbrSfzfm"
                ref="pictureUpload5"
              >
                <template #file="{ file }">
                  <div>
                    <img
                      class="el-upload-list__item-thumbnail"
                      :src="file.url"
                      alt=""
                    />
                    <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleRemove5(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                  </div>
                </template>
              </el-upload>
              <div class="license-right1">
                <div>
                  <p>说明：</p>
                  <p>1.上传文件大小不超过5M；</p>
                  <p>2.仅支持bmp、jpeg、png、jpg格式文件；</p>
                  <p style="color: #f00">3.请加盖公章。</p>
                </div>
              </div>
            </div>
            <div class="f2_form">
              <el-form
                :model="ruleForm"
                :rules="rules"
                ref="ruleForm"
                label-width="160px"
                class="demo-ruleForm"
              >
                <el-form-item label="经办人姓名" prop="jbrname">
                  <el-input
                    v-model="ruleForm.jbrname"
                    @blur="appFincerName(ruleForm.jbrname, 1)"
                  ></el-input>
                </el-form-item>
                <el-form-item label="经办人手机号" prop="jbrphone">
                  <el-input
                    @blur="appFincerPhone(ruleForm.jbrphone, 1)"
                    v-model="ruleForm.jbrphone"
                  ></el-input>
                  <p v-show="showPhones" class="error">请输入正确的手机号</p>
                </el-form-item>
                <el-form-item
                  label="手机验证码"
                  prop="JBRauthcode"
                  v-show="ruleForm.JbrRzstatus !== 'succ'"
                >
                  <el-input v-model="ruleForm.JBRauthcode"></el-input>
                  <div class="timer">
                    <span
                      v-if="JbrTime == 30"
                      @click="getJbrAuthCode(JbrTime, ruleForm)"
                      >获取验证码</span
                    >
                    <span v-else>{{ JbrTime }}秒后重新获取</span>
                  </div>
                </el-form-item>
                <el-form-item label="经办人证件号码" prop="jbrcredentialnumber">
                  <el-input
                    @blur="appFincerNo(ruleForm.jbrcredentialnumber, 1)"
                    v-model="ruleForm.jbrcredentialnumber"
                  ></el-input>
                  <p v-show="shows" class="error">请输入正确的身份证号</p>
                </el-form-item>
              </el-form>
            </div>
          </template>
        </div>
        <!-- 服务协议 -->
        <div class="agreement">
          <img
            @click="submitBtn()"
            v-if="radio"
            src="@/assets/PC/金融服务/组38.png"
            alt=""
          />
          <img
            @click="submitBtn()"
            v-else
            src="@/assets/PC/金融服务/组39.png"
            alt=""
          />
          <span> 我已阅读并同意 </span>
          <a
            href="/public/static/协议/电子签名授权协议-认证平台.pdf"
            target="_back"
            >《电子签名授权委托协议》</a
          >
          <!-- <a href="javascript:void(0)">《技术服务协议》</a> -->
        </div>
        <div class="btn">
          <button
            class="next"
            @click="nextStep"
            :class="{ actives: submitMessage == '提交中' }"
          >
            {{ submitMessage }}
          </button>
        </div>
      </div>
      <!-- 弹窗 -->
      <el-dialog v-model="dialogVisible" v-viewer>
        <img width="100%" :src="dialogImageUrl" alt="" />
      </el-dialog>
    </div>
  </div>
</template>

<script>
import { myPostFetch, base } from "@/utils";
import { ElMessage } from "element-plus";
export default {
  data() {
    return {
      submitMessage: "下一步",
      disabledEntname: false,
      disabledCreditno: false,
      identicalRadio: false,
      radio: false,
      entinfo: null,
      ysx: "",
      FrTime: 30,
      JbrTime: 30,
      status: false,
      isLock: false,
      showPhone: false,
      showPhones: false,
      show: false,
      shows: false,
      fileListBusiness: [], //营业执照
      yyzz: [],
      // 法人证件
      fileListFront: [], //身份证正面
      sfzzm: [],
      fileListReverse: [], //身份证反面
      sfzfm: [],
      // 经办人证件
      jbrFileListFront: [], //身份证正面
      jbrSfzzm: [],
      jbrFileListReverse: [], //身份证反面
      jbrSfzfm: [],
      dialogVisible: false,
      dialogImageUrl: "", //查看缩略图
      fileList: [],
      fileStatusYyzz: "", //营业执照认证状态
      fileStatusFrzm: "", //法人身份证正面认证状态
      fileStatusFrfm: "", //法人身份证反面认证状态
      fileStatusJbrzm: "", //经办人身份证正面认证状态
      fileStatusJbrfm: "", //经办人身份证反面认证状态

      ruleForm: {
        FrRzstatus: "", //法人认证状态
        JbrRzstatus: "", //经办人认证状态
        customerid: "",
        entname: "", //企业名称
        creditno: "", //营业执照
        legalname: "", //法人姓名
        legalphone: "", //法人手机号
        FRauthcode: "", //法人验证码
        FRflowId: "", //法人flowId
        legalcredentialnumber: "", //法人身份证号
        jbrname: "", //经办人姓名
        jbrphone: "", //经办人手机号
        JBRauthcode: "", //经办人验证码
        JBRflowId: "", //经办人flowId
        jbrcredentialnumber: "", //经办人身份证号
      },
      rules: {
        entname: [
          { required: true, message: "请输入企业名称", trigger: "blur" },
        ],
        creditno: [
          { required: true, message: "请输入统一信用代码", trigger: "blur" },
        ],

        legalname: [
          { required: true, message: "请输入法定代表人姓名", trigger: "blur" },
        ],
        legalphone: [
          {
            required: true,
            message: " ",
            trigger: "blur",
          },
        ],
        FRauthcode: [
          {
            required: true,
            message: "请输入验证码",
            trigger: "blur",
          },
        ],
        legalcredentialnumber: [
          {
            required: true,
            message: " ",
            trigger: "blur",
          },
        ],
        // 经办人
        jbrname: [
          { required: true, message: "请输入经办人姓名", trigger: "blur" },
        ],
        jbrphone: [
          {
            required: true,
            message: " ",
            trigger: "blur",
          },
        ],
        JBRauthcode: [
          {
            required: true,
            message: "请输入验证码",
            trigger: "blur",
          },
        ],
        jbrcredentialnumber: [
          {
            required: true,
            message: " ",
            trigger: "blur",
          },
        ],
      },
    };
  },
  mounted() {
    this.getFindentstatus();

    setTimeout(() => {
      this.judgeFit();
      this.transition();
    }, 1000);

    this.ysx = this.$route.query.status;
  },
  methods: {
    // 判断法人信息与经办人信息是否一致
    async judgeFit() {
      let entinfo = await this.entinfo;
      if (!entinfo) return;
      if (
        entinfo.mainindname == entinfo.operatename &&
        entinfo.fincerttel == entinfo.operateTel &&
        entinfo.fincertno == entinfo.operatecertid
      ) {
        this.identicalRadio = true;
      }
    },
    //同法定代表人
    identical() {
      this.identicalRadio = !this.identicalRadio;
      if (!this.identicalRadio) return;

      this.sfzzm.forEach((item) => {
        let a = this.JBRZMupload(item.url, [], "经办人身份证正面");
        this.jbrSfzzm = a;
      });
      this.sfzfm.forEach((item) => {
        let a = this.JBRFMupload(item.url, [], "经办人身份证反面");
        this.jbrSfzfm = a;
      });
      this.ruleForm.jbrname = this.ruleForm.legalname;
      this.ruleForm.jbrphone = this.ruleForm.legalphone;
      this.ruleForm.jbrcredentialnumber = this.ruleForm.legalcredentialnumber;
      if (!this.identicalRadio) {
        this.appFincerNo(this.ruleForm.jbrcredentialnumber, 1);
        this.appFincerPhone(this.ruleForm.jbrphone, 1);
      }
    },
    // 勾选协议
    submitBtn() {
      this.radio = !this.radio;
    },
    // 经办人正面
    JBRZMupload(url, another, oldfilename) {
      let _this = this;
      _this
        .axios({
          method: "get",
          url: url, // 替换为文件的URL
          responseType: "blob", // 设置响应类型为Blob
        })
        .then(async function (response) {
          if (response.status === 200) {
            const blobData = response.data; // 获取Blob数据
            // 现在你可以对Blob数据执行任何需要的操作，例如保存它或者展示它
            // console.log("成功获取Blob数据:", blobData);
            if (!another) {
              another = [];
            }
            let f = _this.blobToFile(blobData, oldfilename);
            let e = {
              name: oldfilename,
              percentage: 0,
              raw: f,
              size: blobData.size,
              status: "ready",
              uid: "",
              url: url,
            };
            another.push(e);
            _this.jbrFileListFront = another[0].raw;
          } else {
            console.error("获取文件失败");
          }
        })
        .catch(function (error) {
          console.error("发生错误:", error);
        });
      return another;
    },
    // 经办人反面
    JBRFMupload(url, another, oldfilename) {
      let _this = this;
      _this
        .axios({
          method: "get",
          url: url, // 替换为文件的URL
          responseType: "blob", // 设置响应类型为Blob
        })
        .then(async function (response) {
          if (response.status === 200) {
            const blobData = response.data; // 获取Blob数据
            // 现在你可以对Blob数据执行任何需要的操作，例如保存它或者展示它
            // console.log("成功获取Blob数据:", blobData);
            if (!another) {
              another = [];
            }
            let f = _this.blobToFile(blobData, oldfilename);
            let e = {
              name: oldfilename,
              percentage: 0,
              raw: f,
              size: blobData.size,
              status: "ready",
              uid: "",
              url: url,
            };
            another.push(e);
            _this.jbrFileListReverse = another[0].raw;
          } else {
            console.error("获取文件失败");
          }
        })
        .catch(function (error) {
          console.error("发生错误:", error);
        });
      return another;
    },
    blobToFile(blob, fileName, lastModified) {
      const options = {
        type: blob.type,
        lastModified: lastModified || Date.now(),
      };

      // 创建一个新的File对象
      try {
        return new File([blob], fileName, options);
      } catch (e) {
        // 在一些浏览器中，File构造函数可能不可用，因此我们可以使用Blob作为备选方案
        const blobWithFileProperties = new Blob([blob], options);
        blobWithFileProperties.name = fileName;
        return blobWithFileProperties;
      }
    },
    // 获取认证信息
    async getFindentstatus() {
      let url = "/api/entauth/findentstatus";
      let params = {};
      let data = await myPostFetch(url, params);
      if (data.data == "null" || data.data == null || data.data.length == 0)
        return;

      if (data.code == 100) {
        let entinfo = data.data.entinfo;
        this.entinfo = data.data.entinfo;
        let file = data.data.file;
        this.ruleForm.customerid = entinfo.customerid;
        if (entinfo.rzstatus == "succ") {
          this.ruleForm.entname = entinfo.entname;
          this.ruleForm.creditno = entinfo.licenseno;
          this.ruleForm.legalname = entinfo.mainindname;
          this.ruleForm.legalphone = entinfo.fincerttel;
          this.ruleForm.legalcredentialnumber = entinfo.fincertno;
          this.ruleForm.jbrname = entinfo.operatename;
          this.ruleForm.jbrphone = entinfo.operateTel;
          this.ruleForm.jbrcredentialnumber = entinfo.operatecertid;
          this.ruleForm.FrRzstatus = entinfo.rzstatus;
          this.ruleForm.JbrRzstatus = entinfo.rzstatus;
          this.fileStatusYyzz = entinfo.rzstatus;
          this.fileStatusFrzm = entinfo.rzstatus;
          this.fileStatusFrfm = entinfo.rzstatus;
          this.fileStatusJbrzm = entinfo.rzstatus;
          this.fileStatusJbrfm = entinfo.rzstatus;
          this.ruleForm.entname == ""
            ? (this.disabledEntname = false)
            : (this.disabledEntname = true);
          this.ruleForm.creditno == ""
            ? (this.disabledCreditno = false)
            : (this.disabledCreditno = true);
          let list = [];
          for (let i = 0; i < file.length; i++) {
            list.push(...file[i]);
          }
          for (let i = 0; i < list.length; i++) {
            if (list[i].newfilename.split("-")[0] == "营业执照") {
              this.yyzz.push({ url: list[i].filepath });
            } else if (list[i].newfilename.split("-")[0] == "法人身份证正面") {
              this.sfzzm.push({ url: list[i].filepath });
            } else if (list[i].newfilename.split("-")[0] == "法人身份证反面") {
              this.sfzfm.push({ url: list[i].filepath });
            } else if (
              list[i].newfilename.split("-")[0] == "经办人身份证正面"
            ) {
              this.jbrSfzzm.push({ url: list[i].filepath });
            } else if (
              list[i].newfilename.split("-")[0] == "经办人身份证反面"
            ) {
              this.jbrSfzfm.push({ url: list[i].filepath });
            }
          }
          return;
        }
      }
    },
    transition() {
      if (!this.identicalRadio) return;
      this.sfzzm.forEach((item) => {
        let a = this.JBRZMupload(item.url, [], "经办人身份证正面");
        this.jbrSfzzm = a;
      });
      this.sfzfm.forEach((item) => {
        let a = this.JBRFMupload(item.url, [], "经办人身份证反面");
        this.jbrSfzfm = a;
      });
    },
    // 法人获取验证码
    async getFrAuthCode(time, item) {
      let { legalname, legalphone, legalcredentialnumber } = item;
      if (legalname == "" || legalphone == "" || legalcredentialnumber == "")
        return ElMessage.error("请输入法人信息");
      let url = "/api/entauth/phonecodes";
      let params = {
        idNumber: legalcredentialnumber,
        idType: "CRED_PSN_CH_IDCARD",
        mobile: legalphone,
        name: legalname,
      };
      let data = await myPostFetch(url, params);
      if (data.msg == "ok") {
        ElMessage.success("验证码发送成功");
        this.ruleForm.FRflowId = data.data.json2.flowId;
        this.code = true;
        if (time != 30) {
          return;
        }
        let times = setInterval(() => {
          time--;
          this.FrTime = time;
          if (this.FrTime == -1) {
            clearInterval(times);
            this.FrTime = 30;
          }
        }, 1000);
        return;
      }
      ElMessage.error("验证码发送失败请检查手机号");
    },
    // 经办人获取验证码
    async getJbrAuthCode(time, item) {
      let { jbrname, jbrphone, jbrcredentialnumber } = item;
      if (jbrname == "" || jbrphone == "" || jbrcredentialnumber == "")
        return ElMessage.error("请输入法人信息");
      let url = "/api/entauth/phonecodes";
      let params = {
        idNumber: jbrcredentialnumber,
        idType: "CRED_PSN_CH_IDCARD",
        mobile: jbrphone,
        name: jbrname,
      };
      let data = await myPostFetch(url, params);
      if (data.msg == "ok") {
        ElMessage.success("验证码发送成功");
        this.ruleForm.JBRflowId = data.data.json2.flowId;
        this.code = true;
        if (time != 30) {
          return;
        }
        let times = setInterval(() => {
          time--;
          this.JbrTime = time;
          if (this.JbrTime == -1) {
            clearInterval(times);
            this.JbrTime = 30;
          }
        }, 1000);
        return;
      }
      ElMessage.error("验证码发送失败请检查手机号");
    },
    // 下一步
    nextStep() {
      if (this.submitMessage == "提交中") return;
      if (!this.radio) return ElMessage.error("请阅读并勾选电子签名授权协议");
      let {
        entname,
        creditno,
        legalname,
        legalphone,
        FRauthcode,
        FRflowId,
        legalcredentialnumber,
        jbrname,
        jbrphone,
        JBRauthcode,
        JBRflowId,
        jbrcredentialnumber,
        customerid,
        FrRzstatus,
        JbrRzstatus,
      } = this.ruleForm;
      if (
        entname == "" ||
        creditno == "" ||
        legalname == "" ||
        legalphone == "" ||
        legalcredentialnumber == "" ||
        jbrname == "" ||
        jbrphone == "" ||
        jbrcredentialnumber == ""
      )
        return ElMessage.error("请输入信息");
      if (
        (FRauthcode == "" && FrRzstatus !== "succ") ||
        (JBRauthcode == "" && JbrRzstatus !== "succ")
      )
        return ElMessage.error("请输入验证码");

      if (
        (FRflowId == "" && FrRzstatus !== "succ") ||
        (JBRflowId == "" && JbrRzstatus !== "succ")
      )
        return ElMessage.error("请先获取验证码");
      if (this.fileListBusiness.length == 0 && this.fileStatusYyzz !== "succ")
        return ElMessage.error("请上传营业执照");
      if (this.fileListFront.length == 0 && this.fileStatusFrzm !== "succ")
        return ElMessage.error("请上传法人身份证正面");
      if (this.fileListReverse.length == 0 && this.fileStatusFrfm !== "succ")
        return ElMessage.error("请上传法人身份证反面");
      if (this.jbrFileListFront.length == 0 && this.fileStatusJbrzm !== "succ")
        return ElMessage.error("请上传经办人身份证正面");
      if (
        this.jbrFileListReverse.length == 0 &&
        this.fileStatusJbrfm !== "succ"
      )
        return ElMessage.error("请上传经办人身份证反面");
      this.submitMessage = "提交中";
      // 调用接口
      let formData = new FormData();
      formData.append("yyzz", this.fileListBusiness); //营业执照
      formData.append("frzm", this.fileListFront); //法人正面
      formData.append("frfm", this.fileListReverse); //法人反面
      formData.append("jbrzm", this.jbrFileListFront); //经办人正面
      formData.append("jbrfm", this.jbrFileListReverse); //经办人反面
      let token = localStorage.getItem("token");
      let url =
        base +
        `/api/entauth/proauth?idNumber=${creditno}&name=${entname}&orgLegalName=${legalname}&orgLegalPhone=${legalphone}&FRauthcode=${FRauthcode}&FRflowId=${FRflowId}&orgLegalIdNumber=${legalcredentialnumber}&operatename=${jbrname}&operateTel=${jbrphone}&JBRauthcode=${JBRauthcode}&JBRflowId=${JBRflowId}&operatecertid=${jbrcredentialnumber}&customerid=${customerid}`;
      this.axios
        .post(url, formData, {
          headers: { "Content-Type": "multipart/form-data", "x-auth": token },
        })
        .then((res) => {
          if (res.data.code == 100) {
            localStorage.setItem("token", res.data.data.toekn);
            this.getFindentstatus();
            // ---------------------------------------------------------
            let productname = localStorage.getItem("productname");
            let productcode = localStorage.getItem("productcode");
            let id = localStorage.getItem("productcodeid");
            let strArr = [];
            for (let i = 0; i < 6; i++) {
              strArr.push(productcode[i]);
            }
            let str = strArr.join("");
            if (productname == "关税保函") {
              if (this.ysx == "ysx") {
                // 跳转关税保函预授信
                this.$router.push(`/gsbhysxApply1`);
                this.submitMessage = "下一步";
                return;
              }
              // 跳转至关税保函证式申请页
              this.$router.push(`/gsbhApplication?status=lbzs`);
              this.submitMessage = "下一步";
            } else if (productname == "关税E保") {
              if (this.ysx == "ysx") {
                // 跳转关税E保预授信
                this.$router.push(`/crossBorderApply1`);
                this.submitMessage = "下一步";
                return;
              }
              // 跳转至关税E保正式申请页
              this.$router.push(`/gsebzsApply1?status=lbzs`);
              this.submitMessage = "下一步";
            } else if (productname == "关税保证保险") {
              if (this.ysx == "ysx") {
                // 跳转关税保函预授信
                this.$router.push(`/gsbhysxApply1`);
                this.submitMessage = "下一步";
                return;
              }
              // 跳转至关税保证保险申请页
              this.$router.push(`/gsbzbxApplication?status=lbzs`);
              this.submitMessage = "下一步";
            } else if (productname == "关税履约保证保险") {
              if (this.ysx == "ysx") {
                // 跳转关税保函预授信
                this.$router.push(`/gsbhysxApply1`);
                this.submitMessage = "下一步";
                return;
              }
              // 跳转至关税履约保证保险申请页
              this.$router.push(`/gslybzbxApplication?status=lbzs`);
              this.submitMessage = "下一步";
            }

            // ----------------------------------------------------------------
            else if (
              productname == "商票贴现融资" ||
              productname == "财票贴现融资" ||
              productname == "银票贴现融资"
            ) {
              // 跳转至商票贴现融资
              let show01 = "";
              if (productname == "银票贴现融资") {
                show01 = 92;
              } else if (productname == "商票贴现融资") {
                show01 = 90;
              } else if (productname == "商票质押融资") {
                show01 = 91;
              } else if (productname == "财票贴现融资") {
                show01 = 93;
              }
              localStorage.setItem("productcode", productcode);
              localStorage.setItem("show01", show01);
              localStorage.setItem("productname", productname);
              this.$router.push(`enquiryApply2`);
              this.submitMessage = "下一步";
            } else if (productname == "商票质押融资") {
              // 跳转至商票贴现融资
              let show01 = 91;
              localStorage.setItem("productcode", productcode);
              localStorage.setItem("show01", show01);
              localStorage.setItem("productname", productname);
              this.$router.push(`enquiryPledgeApply`);
            } else if (productname == "出口保理融资") {
              // 跳转出口保理融资申请
              localStorage.setItem("productcode", productcode);
              localStorage.setItem("productname", productname);
              this.$router.push(`ckblrz`);
              this.submitMessage = "下一步";
            } else if (str == "SCF006") {
              // 跳转至产业数字贷申请页
              this.$router.push(`/CyShuJuDai`);
              this.submitMessage = "下一步";
            }
          }
        });
    },
    // 营业执照------------------------------------------------
    handleChangeBusiness(file, fileList) {
      this.fileListBusiness = fileList[0].raw;
    },
    // 删除
    handleRemove1(file) {
      this.$refs.pictureUpload1.handleRemove(file);
      this.fileListBusiness = [];
      this.fileStatusYyzz = "";
    },
    //自定义上传文件
    uploadFileBusiness(file) {
      return;
    },

    // 法人身份证正面-----------------------------------------------------
    handleChangeFront(file, fileList) {
      this.fileListFront = fileList[0].raw;
      if (this.identicalRadio) {
        this.jbrFileListFront = this.fileListFront;
        this.jbrSfzzm.push(file);
      }
    },
    uploadFileFront(file) {
      return;
    },
    // 删除
    handleRemove2(file) {
      this.$refs.pictureUpload2.handleRemove(file);
      this.fileListFront = [];
      this.fileStatusFrzm = "";
      this.ruleForm.FrRzstatus = "";
      if (this.identicalRadio) {
        this.jbrFileListFront = this.fileListFront;
        this.jbrSfzzm = [];
      }
    },
    // 法人身份证反面——————————————————————————————————————————————————————————
    handleChangeReverse(file, fileList) {
      this.fileListReverse = fileList[0].raw;
      if (this.identicalRadio) {
        this.jbrFileListReverse = this.fileListReverse;
        this.jbrSfzfm.push(file);
      }
    },
    uploadFileReverse(file) {
      return;
    },
    // 删除
    handleRemove3(file) {
      this.$refs.pictureUpload3.handleRemove(file);
      this.fileListReverse = [];
      this.fileStatusFrfm = "";
      this.ruleForm.FrRzstatus = "";
      if (this.identicalRadio) {
        this.jbrFileListReverse = this.fileListReverse;
        this.jbrSfzfm = [];
      }
    },
    // 经办人证件正面------------------------------------------------------
    jbrHandleChangeFront(file, fileList) {
      this.jbrFileListFront = fileList[0].raw;
    },
    uploadFileFront(file) {
      return;
    },
    // 删除
    handleRemove4(file) {
      this.$refs.pictureUpload4.handleRemove(file);
      this.jbrFileListFront = [];
      this.fileStatusJbrzm = "";
      this.ruleForm.JbrRzstatus = "";
    },
    // 经办人证件反面------------------------------------------------------
    jbrHandleChangeReverse(file, fileList) {
      this.jbrFileListReverse = fileList[0].raw;
      // console.log(this.jbrFileListReverse);
    },
    uploadFileFront(file) {
      return;
    },
    // 删除
    handleRemove5(file) {
      this.$refs.pictureUpload5.handleRemove(file);
      this.jbrFileListReverse = [];
      this.fileStatusJbrfm = "";
      this.ruleForm.JbrRzstatus = "";
    },
    // 查看缩略图---------------------------------------------------
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    // 身份证校验
    appFincerNo(idNumber, index) {
      if (this.entinfo.fincertno != idNumber && index == 0) {
        this.ruleForm.FrRzstatus = "";
      } else if (this.entinfo.fincertno == idNumber && index == 0) {
        this.ruleForm.FrRzstatus = "succ";
      } else if (this.entinfo.operatecertid != idNumber && index == 1) {
        this.ruleForm.JbrRzstatus = "";
      } else if (this.entinfo.operatecertid == idNumber && index == 1) {
        this.ruleForm.JbrRzstatus = "succ";
      }

      let fincertNO = idNumber;
      let IDRe18 =
        /^([1-6][1-9]|50)\d{4}(18|19|20)\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
      let IDre15 =
        /^([1-6][1-9]|50)\d{4}\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}$/;
      if (IDRe18.test(fincertNO) || IDre15.test(fincertNO)) {
        //判断第18位校验值
        if (fincertNO.length == 18) {
          let charArray = Array.from(fincertNO);
          //前十七位加权因子
          let idCardWi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
          //这是除以11后，可能产生的11位余数对应的验证码
          let idCardY = ["1", "0", "X", "9", "8", "7", "6", "5", "4", "3", "2"];
          let sum = 0;
          for (let i = 0; i < idCardWi.length; i++) {
            let current = charArray[i];
            let count = current * idCardWi[i];
            sum += count;
          }
          let idCardLast = charArray[17];
          let idCardMod = sum % 11;
          if (idCardY[idCardMod].toUpperCase() == idCardLast.toUpperCase()) {
            index == 0 ? (this.show = false) : (this.shows = false);
            return true;
          } else {
            index == 0 ? (this.show = true) : (this.shows = true);
            return false;
          }
        }
      } else {
        index == 0 ? (this.show = true) : (this.shows = true);
        return false;
      }
    },

    // 校验手机号
    appFincerPhone(phone, index) {
      if (this.entinfo.fincerttel != phone && index == 0) {
        this.ruleForm.FrRzstatus = "";
      } else if (this.entinfo.fincerttel == phone && index == 0) {
        this.ruleForm.FrRzstatus = "succ";
      } else if (this.entinfo.operateTel != phone && index == 1) {
        this.ruleForm.JbrRzstatus = "";
      } else if (this.entinfo.operateTel == phone && index == 1) {
        this.ruleForm.JbrRzstatus = "succ";
      }

      let value = Number(phone);
      if (value == "")
        return index == 0 ? (this.showPhone = true) : (this.showPhones = true);
      if (value == NaN)
        return index == 0 ? (this.showPhone = true) : (this.showPhones = true);
      value = value.toFixed(0);
      let reg = /^1[3-9]\d{9}$/;
      if (!reg.test(value)) {
        index == 0 ? (this.showPhone = true) : (this.showPhones = true);
      } else {
        index == 0 ? (this.showPhone = false) : (this.showPhones = false);
      }
    },
    // 名字验证
    appFincerName(name, index) {
      if (this.entinfo.mainindname != name && index == 0) {
        this.ruleForm.FrRzstatus = "";
      } else if (this.entinfo.mainindname == name && index == 0) {
        this.ruleForm.FrRzstatus = "succ";
      } else if (this.entinfo.operatename != name && index == 1) {
        this.ruleForm.JbrRzstatus = "";
      } else if (this.entinfo.operatename == name && index == 1) {
        this.ruleForm.JbrRzstatus = "succ";
      }
    },
  },
};
</script>

<style lang="scss" scoped>
ul {
  list-style: none;
}
.license-right1 {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  div {
    p {
      font-size: 12px;
      line-height: 24px;
    }
  }
}
.box {
  position: relative;
  width: 1920px;
  box-sizing: border-box;
  padding-bottom: 80px;
  background: #f5f7fa;
  .f2 {
    box-sizing: border-box;
    padding: 0px 80px;
    margin: 0 auto;
    width: 1200px;
    background-color: #fff;
    .content {
      box-sizing: border-box;
      padding: 0px 20px 50px 20px;
      margin: 0 auto;
      height: 100%;
      .f2_content {
        box-sizing: border-box;
        padding: 0px 65px;
        .f2_form {
          width: 100%;
          display: flex;
          .timer {
            height: 40px;
            position: absolute;
            right: 20px;
            top: 5px;
            font-size: 16px;
            font-family: Source Han Sans SC;
            font-weight: 400;
            color: #3f6ef2;
            cursor: pointer;
            user-select: none;
          }
        }
        .special {
          display: flex;
          align-items: center;
          .identical {
            box-sizing: border-box;
            padding: 3px 5px;
            // background-color: #98d1f7;
            display: flex;
            align-items: center;
            margin-left: 80px;
            cursor: pointer;
            span {
              font-size: 14px;
              color: #666;
              margin-left: 5px;
              font-size: 14px;
              font-weight: 600;
              color: #333333;
            }
            img {
              width: 15px;
              height: 15px;
            }
          }
        }
      }
      .error {
        margin: 0;
        padding: 0;
        height: 15px;
        line-height: 15px;
        font-size: 13px;
        color: #f56c6c;
        position: absolute;
        bottom: -20px;
      }
      .title {
        display: flex;
        align-items: center;
        box-sizing: border-box;
        font-size: 18px;
        font-weight: bold;
        color: #333333;
        h6 {
          width: 5px;
          height: 18px;
          background-color: #0a7be0;
          margin-right: 10px;
        }
      }
      .titles {
        margin: 30px 0;
        font-size: 16px;
      }
      // 服务协议
      .agreement {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 25px;
        text-align: center;
        margin-top: 10px;
        user-select: none;
        span {
          font-size: 14px;
          color: #666;
          margin-left: 7px;
        }
        img {
          width: 15px;
          height: 15px;
          cursor: pointer;
        }
        a {
          font-size: 14px;
          color: #0a7be0;
        }
      }
      // 按钮
      .btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 50px;
        margin-top: 10px;
        .last {
          width: 180px;
          height: 34px;
          background: #0a7be0;
          opacity: 0.3;
          border-radius: 4px;
        }
        .next {
          width: 180px;
          height: 34px;
          background: #0a7be0;
          border-radius: 4px;
          &.actives {
            background-color: rgba(10, 123, 224, 0.6);
          }
        }
        button {
          align-items: center;
          justify-content: center;
          display: flex;
          border-radius: 5px;
          width: 180px;
          height: 50px;
          color: #fff;
          border: 0px;
        }
      }
    }
  }
}
// 营业执照
// 身份证正反面
.license {
  display: flex;
  margin-bottom: 20px;
  margin-left: 0;

  .aaa {
    width: 120px;
    font-size: 16px;
    font-family: Source Han Sans SC;
    font-weight: 400;
    color: #999999;
  }

  .permit {
    position: relative;
    // display: flex;
    // flex-direction: column;
    // justify-content: center;
    // align-items: center;
    overflow: hidden;
    width: 212px;
    height: 125px;
    background-size: 100% 100%;
    margin-right: 15px;
    overflow: hidden;
    cursor: pointer;

    img {
      width: 250px;
      height: 130px;
    }
  }
  .permit1 {
    background: url(@/assets/PC/新增补充切图/03商票驿/组77.png) no-repeat;
  }
  .permit-front {
    background: url(@/assets/PC/新增补充切图/03商票驿/组84.png) no-repeat;
    background-size: 100% 100%;
  }

  .permit-reverse {
    background: url(@/assets/PC/新增补充切图/03商票驿/组85.png) no-repeat;
    background-size: 100% 100%;
  }

  .card {
    width: 216px;
    height: 123px;
    margin-right: 8px;

    img {
      width: 100%;
      height: 100%;
    }
  }

  .license-right {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    div {
      width: 100%;
      p {
        font-family: Source Han Sans SC;
        line-height: 24px;
        font-size: 12px;
        font-weight: 300;
        color: #636363;
      }
    }
  }
}

.license1 {
  .aaa11 {
    font-size: 14px;
    font-weight: 600;
    color: #333333;
    width: 130px;
    text-align: right;
    padding: 0px 14px;
  }
}

::v-deep(.el-upload-list--picture .el-upload-list__item-thumbnail) {
  width: 140px;
}

::v-deep(.el-upload-list--picture .el-upload-list__item-name) {
  display: none;
}

::v-deep(.upload-demo .el-upload-list) {
  display: flex;
  flex-wrap: wrap;
}

::v-deep(.el-upload-list--picture .el-upload-list__item) {
  width: 180px;
  margin-right: 16px;
}

::v-deep(.el-select .el-input input) {
  width: 100px;
}
//
::v-deep(.el-form-item__label) {
  font-size: 14px;
  font-weight: 600;
  color: #333333;
}
::v-deep(.el-form-item) {
  margin-bottom: 22px;
}
/* 输入框样式  */
::v-deep(.el-input__inner) {
  font-size: 12px;
  box-sizing: border-box;
  width: 500px;

  height: 38px;
  font-size: 15px;
  border: 1px solid #e0e0e0;
  border-radius: 0px;
  padding: 10px 10px;
  color: #606266;
  outline: 0;
  line-height: 35px !important;
}
::v-deep(.el-textarea .el-textarea__inner) {
  box-sizing: border-box;
  width: 500px;
  // height: 0.2031px;
  font-size: 16px;
  border: 1px solid #e0e0e0;
  border-radius: 0px;
  padding: 0px 10px;
  color: #606266;
  outline: 0;
  font-weight: 500;
  line-height: 35px !important;
}
::v-deep(.aaaa .el-input__inner) {
  width: 355px;
}
::v-deep(.el-upload__tip) {
  font-size: 12px;
}
::v-deep(.el-upload--picture-card) {
  display: inline-block;
  background-color: rgba(245, 245, 245, 0.1);
  border: 0;
}
::v-deep(
    .el-upload-list--picture-card .el-upload-list__item-thumbnail,
    .el-upload-list--picture-card .el-upload-list__item-actions
  ) {
  width: 250px;
  height: 125px;
  margin-top: -5px;

  // top: -15px;
}
::v-deep(.el-upload-list--picture-card .el-upload-list__item-actions) {
  margin-left: 10px;
  margin-top: -15px;
}
::v-deep(.el-upload-list--picture-card .el-upload-list__item) {
  width: 100%;
  height: 160px;
  display: flex;
  margin-left: -20px;
  z-index: 888;
}
::v-deep(
    .el-upload-list--picture-card .el-upload-list__item-actions span + span
  ) {
  margin-left: 35px;
}
::v-deep(.el-upload--picture-card) {
  width: 240px;
}
</style>
<style lang="scss">
// 上传

.el-dialog__header {
  border: 0px;
}
</style>
